<!DOCTYPE html>
<html>
<head>
    <title>后端服务测试</title>
    <meta charset="utf-8">
    <style>
        body { font-family: Arial, sans-serif; margin: 20px; }
        .test-item { margin: 10px 0; padding: 10px; border: 1px solid #ddd; }
        .success { background-color: #d4edda; }
        .error { background-color: #f8d7da; }
        button { padding: 10px 20px; margin: 5px; }
    </style>
</head>
<body>
    <h1>云打印系统后端服务测试</h1>
    
    <div class="test-item">
        <h3>1. 健康检查</h3>
        <button onclick="testHealth()">测试健康检查</button>
        <div id="health-result"></div>
    </div>
    
    <div class="test-item">
        <h3>2. 管理员登录</h3>
        <button onclick="testAdminLogin()">测试管理员登录</button>
        <div id="login-result"></div>
    </div>
    
    <div class="test-item">
        <h3>3. 获取仪表板数据</h3>
        <button onclick="testDashboard()">测试仪表板API</button>
        <div id="dashboard-result"></div>
    </div>

    <script>
        const BASE_URL = 'http://localhost:3000';
        let authToken = '';

        async function testHealth() {
            const resultDiv = document.getElementById('health-result');
            try {
                const response = await fetch(`${BASE_URL}/health`);
                const data = await response.json();
                
                if (response.ok) {
                    resultDiv.innerHTML = `<div class="success">✅ 后端服务正常运行<br>响应: ${JSON.stringify(data)}</div>`;
                } else {
                    resultDiv.innerHTML = `<div class="error">❌ 健康检查失败: ${response.status}</div>`;
                }
            } catch (error) {
                resultDiv.innerHTML = `<div class="error">❌ 无法连接到后端服务<br>错误: ${error.message}<br><strong>请确保后端服务已启动！</strong></div>`;
            }
        }

        async function testAdminLogin() {
            const resultDiv = document.getElementById('login-result');
            try {
                const response = await fetch(`${BASE_URL}/api/admin/auth/login`, {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json'
                    },
                    body: JSON.stringify({
                        username: 'admin',
                        password: 'admin123'
                    })
                });
                
                const data = await response.json();
                
                if (response.ok && data.success) {
                    authToken = data.data.token;
                    resultDiv.innerHTML = `<div class="success">✅ 管理员登录成功<br>Token: ${authToken.substring(0, 20)}...</div>`;
                } else {
                    resultDiv.innerHTML = `<div class="error">❌ 登录失败: ${data.message || '未知错误'}</div>`;
                }
            } catch (error) {
                resultDiv.innerHTML = `<div class="error">❌ 登录请求失败<br>错误: ${error.message}</div>`;
            }
        }

        async function testDashboard() {
            const resultDiv = document.getElementById('dashboard-result');
            
            if (!authToken) {
                resultDiv.innerHTML = `<div class="error">❌ 请先登录获取Token</div>`;
                return;
            }
            
            try {
                const response = await fetch(`${BASE_URL}/api/admin/dashboard`, {
                    method: 'GET',
                    headers: {
                        'Authorization': `Bearer ${authToken}`,
                        'Content-Type': 'application/json'
                    }
                });
                
                const data = await response.json();
                
                if (response.ok && data.success) {
                    resultDiv.innerHTML = `<div class="success">✅ 仪表板数据获取成功<br>数据: ${JSON.stringify(data.data, null, 2)}</div>`;
                } else {
                    resultDiv.innerHTML = `<div class="error">❌ 获取仪表板数据失败: ${data.message || '未知错误'}</div>`;
                }
            } catch (error) {
                resultDiv.innerHTML = `<div class="error">❌ 请求失败<br>错误: ${error.message}</div>`;
            }
        }

        // 页面加载时自动测试健康检查
        window.onload = function() {
            testHealth();
        };
    </script>
</body>
</html>